Ext.ns("liang.mgr");

liang.mgr.CasePanel = Ext.extend(Ext.grid.GridPanel, {

	url : null,
	caseFormPanel : null,
	submitWindow : null,
	initComponent : function() {
		var _store = new Ext.data.JsonStore({
					url : this.url,
					root : 'caze',
					fields : ['id', 'name', 'url', 'logo', 'describe'],
					autoLoad : true
				});
		this.store = _store;

		liang.mgr.CasePanel.superclass.initComponent.call(this);
	},
	constructor : function(cfg) {
		cfg = cfg || {};
		Ext.apply(this, cfg);
		liang.mgr.CasePanel.superclass.constructor.call(this, {
					xtype : "grid",
					closable : true,
					width : 547,
					height : 250,
					columns : [{
								header : "序号",
								sortable : true,
								dataIndex : "id",
								width : 100
							}, {
								header : "名称",
								dataIndex : "name",
								width : 100
							}, {
								header : "案例地址",
								dataIndex : "url",
								width : 100
							}, {
								header : "图标",
								align : 'center',
								sortable : true,
								dataIndex : "logo",
								width : 300,
								renderer : function(logo) {
									return '<img alt="logo" src="' + logo
											+ '">';
								}
							}, {
								header : "描述",
								dataIndex : "describe",
								width : 100,
								align : "center"
							}],
					tbar : [{
								scope : this,
								text : "添加案例",
								handler : this.addCase
							}]
				});
	},

	getCaseFormPanel : function() {

		var _fieldSet = new Ext.form.FieldSet({
			title : '案例信息',
			anchor : "99%",
			items : [{
				baseCls : 'x-plain',
				style : 'padding:0 5 0 10px',
				layout : 'column',
				plain : true,
				items : [{
							columnWidth : 0.635,
							baseCls : 'x-plain',
							layout : 'form',
							labelWidth : 55,
							defaults : {
								xtype : 'textfield',
								allowBlank:false,
								anchor : '100%'
							},
							items : [{
										fieldLabel : '案例名称',
										name : 'dataModel.caze.name'
									}, {
										fieldLabel : '案例地址',
										name : 'dataModel.caze.url'
									}, {
										xtype:'field',
										id : 'upload-file',
										fieldLabel : '上传logo',
										inputType : 'file',
										name : 'file',
										listeners:{
										     change:function(textfield,newval,oldval){
										     	//console.log(Ext.get('upload-file').dom.files[0].getAsDataURL());
										     	var filert = this.getEl().dom;//mozFullPath
										     	//console.log(this.getEl().dom.files[0].mozFullPath);
										     	var photo=Ext.getCmp('ex-photo');
										     	console.info(photo.bodyStyle);
										     	photo.bodyStyle='background-image:url('+newval+')';
										     	photo.ownerCt.doLayout();
										          console.log(photo.bodyStyle);
										     }
										
										}
									}, {
										xtype : 'textarea',
										height : 75,
										fieldLabel : '案例描述',
										name : 'dataModel.caze.describe'

									}]
						}, {
							columnWidth : 0.365,
							style : 'padding-left:10px',
							// xtype : 'panel',
							// align : "center",
							items : [{
								id:'ex-photo',
                                        name : 'photo',
								anchor : '100%',
								height : 150,
								bodyStyle : 'background-image:url(./res/images/bd_logo.png)'
									// ,html : '<img
									// src="./res/images/bd_logo.png">'//
									// ./res/images/bd_logo.png
							}]
						}],
				listeners : {}
			}]
		});

		var _formPanel = new Ext.form.FormPanel({
					style : 'padding: 10px',
					labelWidth : 50,
					labelAlign : "left",
					buttonAlign : 'center',
					baseCls : 'x-plain',
					fileUpload : true,
					enctype : 'multipart/form-data',
					frame : true,
					method : 'POST',
					items : _fieldSet
				});

		return _formPanel;
	},
	initSubmitWindow : function() {
		this.submitWindow = new liang.mgr.SubmitWindow({
					scope : this,
					parentCt : this,
					width : 505,
					height : 300,
					newFormPanel : this.getCaseFormPanel(),
					success : this.submitSuccess
				});
	},
	addCase : function(btn, evt) {
		if (!this.submitWindow) {
			this.initSubmitWindow();
		}
		this.submitWindow.setUrl('mgr/casesave.action');
		this.submitWindow.setTitle('新增案例');
		this.submitWindow.doLayout(true);
		this.submitWindow.show();
	},
	updateCase : function(btn, evt) {

	},
	deleteCase : function(btn, evt) {

	},
	submitSuccess : function(form, action) {
		// 获得要操作的Panal
		var submitWindow = action.options.scope;
		Ext.Msg.alert(Ext.getCmp('upload-file').getValue());

		// console.dir(Ext.getCmp("upload-file"));
		// console.dir(action.options);

		// 动态新增数据
		var _gridStore = submitWindow.parentCt.getStore();
		var _result = action.result.result;
		var _record = new Ext.data.Record({
					id : _result.id,
					name : _result.name,
					url : _result.url,
					logo : _result.logo,
					describe : _result.describe
				});
		_gridStore.add(_record);

		submitWindow.parentCt.doLayout();
		form.reset();
		submitWindow.hide();
	}
})